<script setup lang="ts">
import myTopic from "@/composables/myTopic.ts";
const route = useRoute();
const router = useRouter();
const {cat,getCat,editCat} = myTopic();
const c_id = route?.params?.c_id;
await getCat(c_id);
const tabs = ref([
  {label:'帖子大类添加',routeName:'cat.add'},
  {label:'【'+cat.value?.title+'】的编辑',routeName:'cat.edit',switchShow:true},
]);
const onSubmit = async ()=>{
  try {
    await editCat(cat);
    await router.push({name:'cat.index'})
  }catch (error){

  }
}
</script>

<template>
  <main class="cat_edit" v-if="cat">
    <my-tab :tabs="tabs"/>
    <el-card shadow="never">
      <el-form label-width="120px">
        <el-form-item class="item" label="帖子大类标题">
          <input v-model="cat.title" v-clearError="'title'"/>
          <my-error name="title"/>
        </el-form-item>
        <el-form-item class="item" label="帖子大类Icon">
          <input v-model="cat.icon" v-clearError="'icon'"/>
          <my-error name="icon"/>
        </el-form-item>
        <el-form-item class="item" label="排序">
          <input v-model="cat.sort" v-clearError="'sor'" type="number"/>
          <my-error name="sort"/>
        </el-form-item>
        <el-form-item>
          <el-button type="success" @click="onSubmit">确认修改</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </main>
</template>

<style lang="scss" scoped>
main.cat_edit{
  @apply p-3;
  .item{
    input{
      @apply border border-slate-400 rounded outline-slate-400 py-[2px] px-2 w-1/3;
    }
  }
}
</style>